<extend name="Public/base" />
<block name="style">
<link rel="stylesheet" type="text/css"
	href="__STATIC__/css/compiled/wizard.css">

<link rel="stylesheet" type="text/css"
	href="__STATIC__/css/libs/dropzone.css">
	
	<link rel="stylesheet" type="text/css"
	href="__STATIC__/lib/selectize/css/selectize.default.css">

</block>

<block name="body">
<div class="row">
	<div class="col-lg-12">
		<div class="main-box clearfix" style="min-height: 1180px;">
			<header class="main-box-header clearfix">
				<h2>添加推荐内容</h2>
			</header>
			<div class="main-box-body clearfix">
				<div id="addVideoWizard" class="wizard">
					<div class="wizard-inner">
						<ul class="steps">
							<li data-target="#step1" class="active"><span
								class="badge badge-primary">1</span>添加资料<span class="chevron"></span></li>
							<li data-target="#step2"><span class="badge">2</span>上传封面<span
								class="chevron"></span></li>
						</ul>
								<div class="actions">
							<button type="button" class="btn btn-default btn-mini btn-prev">
								<i class="icon-arrow-left"></i>上一步
							</button>
							<button type="button"
								class="btn btn-success btn-mini btn-next ajax-post"
								target-form="form-horizontal" data-last="完成">下一步</button>


						</div>
					</div>
					<div class="step-content">
						<div class="step-pane active" id="step1">

							<h4></h4>
							<form class="form-horizontal" action="{:U()}" method="post">
								<input type="hidden" name="place_id" value="{$place_id}">
								<input class="rec_picture" name="picture_id"
									id="rec_picture_hidden" type="hidden" value="0" />

								<div class="form-group">
									<label for="recommendoTitle" class="col-lg-1 control-label">推荐标题</label>
									<div class="col-lg-11">
										<input type="text" class="form-control" id="recommendoTitle"
											name="rec_title" placeholder="推荐标题">
									</div>
								</div>
								
								
								<div class="form-group">
									<label for="recUrl" class="col-lg-1 control-label">跳转地址</label>
									<div class="col-lg-11">
										<input type="text" class="form-control" id="recUrl"
											name="rec_url" placeholder="视频地址">
									</div>
								</div>

								<div class="form-group">
									<label for="recContent" class="col-lg-1 control-label">推荐介绍</label>
									<div class="col-lg-11">
										<textarea class="form-control" name="rec_content"
											id="recContent" rows="4">{$info.rec_content}</textarea>
									</div>
								</div>
							</form>
						</div>
						<div class="step-pane" id="step2">

							<h4 style="text-align: center;">
								上传封面200*112 <span id="upload_tips"></span>
							</h4>
							<div class="form-group">
								<input type="file" name="picture" id="rec_picture_file"
									style="display: none;">

								<div id="dropzone">
									<div id="picture-upload" class="dropzone dz-clickable">
										<div id="rec_picture_tip" class="dz-default dz-message">

										</div>
										<img id="rec_picture_img" width="200" height="112"
											class="videopic-center"
											src="__STATIC__/images/uploadingv.png" style="display: none;">
									</div>

								</div>
							</div>
						</div>

					</div>

				</div>
			</div>
		</div>
	</div>
</div>


</block>

<block name="script"> <script src="__STATIC__/js/wizard.js"></script>
<script type="text/javascript" src="__STATIC__/js/jquery.fileupload.js"></script>

<script src="__STATIC__/js/hogan.js"></script> 
<script
	src="__STATIC__/lib/selectize/js/standalone/selectize.js">
	</script>
 
<script src="__STATIC__/js/jquery.pwstrength.js"></script> <script
	type="text/javascript">
	 

	//选择图片文件之后立即上传表单
	$('#rec_picture_file').change(function() {
		$('#upload_tips').html('-上传中...');
		$("#rec_picture_img").show();
		$("#rec_picture_tip").hide();
	});

	$("#rec_picture_file").fileupload(
			{
				url : "{:U('Recommend/File/uploadRecommendPicture')}",
				done : function(e, result) {
					var json = result.result;
					if (json.status) {
						$('#upload_tips').html('-上传成功');
						$("#rec_picture_img").attr("src", json.url);
						$('#rec_picture_hidden').val(json.id);

					} else {
						$('#upload_tips').html('-上传失败');
						$('#upload_tips').html('');
						$('#rec_picture_hidden').val('0');
						$("#rec_picture_img").hide();
						$("#rec_picture_img").attr("src",
								'__STATIC__/images/uploadingv.png');
						$("#rec_picture_tip").show();
						$('#rec_picture_file').val('');
					}
				}
			});

	$(function() {
		$('#addVideoWizard').wizard();
	});

	$("#rec_picture_tip").click(function() {
		$("#rec_picture_file").click();
	});

	$("#rec_picture_img").click(
			function() {
				$('#upload_tips').html('');
				$('#rec_picture_hidden').val('0');
				$("#rec_picture_img").hide();
				$("#rec_picture_img").attr("src",
						'__STATIC__/images/uploadingv.png');
				$("#rec_picture_tip").show();
			});
	function format(item) {
		return item.nickname;
	}
</script> </block>
